<template>
<div class="wrapper">
  <swiper :options="swiperOption">
    <!-- slides -->
    <swiper-slide>
      <img class="swiper-img" src="http://mp-piao-admincp.qunarzz.com/mp_piao_admin_mp_piao_admin/admin/20193/d7bbc21db442366a882e04ddc984669a.jpg_750x200_85e640d9.jpg" alt="">
    </swiper-slide>
    <!-- <swiper-slide>
      <img class="swiper-img" src="http://mp-piao-admincp.qunarzz.com/mp_piao_admin_mp_piao_admin/admin/20197/1185800de597104e7eefa3cc3df29f2b.jpg_750x200_7833747e.jpg" alt="">
    </swiper-slide> -->
    <div class="swiper-pagination-swiper"  slot="pagination"></div>
  </swiper>
</div>  
</template>

<script>
  export default {
    name: 'HomeSwiper',
    data() {
      return {
       swiperOption:{
         pagination:".swiper-pagination-swiper",
         loop: true
       }
      }
    },
    computed: {
      },
    mounted() {
    }
  }
</script>
<style lang="scss" scoped>
// .wrapper >>> .swiper-pagination-bullet-active{
//       background-color: red!important;
// }
.wrapper{
  overflow: hidden;
  height: 0;
  padding-bottom: 26.66%;
    .swiper-img{
      width: 100%;
    }
    
}
</style>